<template>
  <div>
    <h1>页面1 模拟数据以及请求</h1>
    <br />
  </div>
</template>

<script>
// 引入我们导好的axios请求模块
import http from "../../plugins/request";
import {mockDemo1} from "../../plugins/mockjs";

export default {
  name: "Page1",
  props: {
    msg: String
  },
  data() {
    return {
      isReqFinish: false
    };
  },
  methods: {},
  mounted() {

    // 1.单纯获得一个假数据
    console.log("1.mockDemo1:" + JSON.stringify(mockDemo1))

    // 2.模拟网络请求
    http.get("/mockApi/test").then(r => {
      console.log("2./api/test得到的数据1:" + JSON.stringify(r));
    });

    // 3.模拟网络获取内容速度
    http.get("/mockApi/list?id=xxx").then(r => {
      console.log("3./api/test得到的数据1:" + JSON.stringify(r));
    });


    // 4.模拟登录
    // /api/login?account=123&password=456
    http({
      url: "/mockApi/login",
      method: "post",
      data: {
        account: "123",
        password: "456" 
      }
    }).then(r => {
      console.log("4./api/login得到的数据2:" + JSON.stringify(r));
    });
  }
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style lang="less">
</style>

